<template>
    <div id="user-list">
    </div>
</template>

<script>
import userRoleMap from './common/roleMap'

export default {
  components: {},
  data () {
    return {

    }
  },
  computed: {},
  watch: {},
  methods: {},
  created () {
    let eventEmitter = BJY.eventEmitter
    // 监听人数变化
    eventEmitter.on(
      eventEmitter.USER_COUNT_CHANGE,
      function (e, data) {
        $('#user-count').text('(' + data.userCount + ')')
      }
    )
  },
  mounted () {
    BJY.UserList.create({
      element: $('#user-list'),
      renderUser: function (user, width, height) {
        return {
          id: user.id,
          name: user.name,
          number: user.number,
          // 头像需压缩
          avatar: BJY.compressImage({
            url: user.avatar,
            width: width,
            height: height
          }),
          avatar2x: BJY.compressImage({
            url: user.avatar,
            width: width * 2,
            height: height * 2
          }),
          // 根据用户类型，配置角色的英文和本地语言
          role: userRoleMap[user.type].en,
          localRole: userRoleMap[user.type].cn
        }
      }
    })
  },
  beforeDestroy () {}
}
</script>

<style lang='less' scoped>
//@import url(); 引入公共css类

</style>
